﻿@model ElCharro01.Models.Variant
@{
    ViewBag.Title = "Create";
    Layout = "~/Views/Shared/_LayoutAdmin.cshtml";
}
<link href="@Url.Content("~/Content/themes/Plugins/ColorPicker/css/layout.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/themes/Plugins/ColorPicker/css/colorpicker.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jQueryFixes.js")" type="text/javascript"></script>
<h2 align="center">
    Gestione Prodotti->Aggiungi Variante Al Prodotto : @ViewBag.ProductName</h2>
@using (Html.BeginForm("Create", "Variant", new { ProductId = ViewBag.ProductId }, FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Variant</legend>
        <div class="editor-label">
            @Html.LabelFor(model => model.Colore)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Colore)
            @Html.ValidationMessageFor(model => model.Colore)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.CodiceColore)
        </div>
        <div class="editor-field">
            <div id="colorSelector">
                <div style="background-color: #0000ff">
                </div>
            </div>
            <pre>
                        <script type="text/javascript">
                            $('#colorSelector').ColorPicker({
                                color: '#0000ff',
                                onShow: function (colpkr) {
                                    $(colpkr).fadeIn(500);
                                    return false;
                                },
                                onHide: function (colpkr) {
                                    $(colpkr).fadeOut(500);
                                    return false;
                                },
                                onChange: function (hsb, hex, rgb) {
                                    $('#colorSelector div').css('backgroundColor', '#' + hex);
                                    $('#CodiceColore').val(hex);
                                }
                            });

                        </script></pre>
            @Html.HiddenFor(model => model.CodiceColore)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.PrezzoUnitario)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.PrezzoUnitario)
            @Html.ValidationMessageFor(model => model.PrezzoUnitario) €
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.Taglia)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Taglia)
            @Html.ValidationMessageFor(model => model.Taglia)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.InStock)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.InStock)
            @Html.ValidationMessageFor(model => model.InStock)
        </div>
        <div class="editor-field">
            @Html.Label("Seleziona l'immagine da inviare.")
            <div>
                Immagine Frontale</div>
            <div>
                <input type="file" id="FrontImage" name="FrontImage" size="23" />
            </div>
        </div>
        <div class="editor-field">
            @Html.Label("Seleziona l'immagine da inviare.")
            <div>
                Immagine Posteriore</div>
            <div>
                <input type="file" id="BackImage" name="BackImage" size="23" />
            </div>
        </div>
        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

<div class="centralo">
    @Html.ActionLink("Torna Indietro", "Index","Product")
</div>

